import 'package:auto_route/auto_route.dart';
import 'package:distribution_mall_flutter/constant/constant.dart';
import 'package:distribution_mall_flutter/generated/l10n.dart';
import 'package:distribution_mall_flutter/utils/common_widget.dart';
import 'package:distribution_mall_flutter/router/router.gr.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

@RoutePage()
class DeleteAccountNoticePage extends ConsumerStatefulWidget {
  const DeleteAccountNoticePage({super.key});

  @override
  ConsumerState createState() => _DeleteAccountNoticePageState();
}

class _DeleteAccountNoticePageState
    extends ConsumerState<DeleteAccountNoticePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(S.current.important_note),
        leading: CommonBtnWidget.arrowBack(),
      ),
      bottomNavigationBar: Container(
          width: double.infinity,
          height: 42,
          margin:
              const EdgeInsets.only(left: 24, right: 24, bottom: 33, top: 16),
          child: ElevatedButton(
            onPressed: () {
              appRouter.push(const DeleteAccountLoadingRoute());
            },
            child: const Text('PROCEED'),
          )),
      body: Column(
        children: [
          const Divider(
            height: 1,
          ),
          Expanded(
              child: Container(
            margin: const EdgeInsets.only(left: 24, right: 24, top: 24),
            width: double.infinity,
            child: SingleChildScrollView(
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  ...S.current.important_note_content
                      .split('.')
                      .where((e) => e.isNotEmpty)
                      .map((e) {
                    return NoticeItem(text: "${e}.");
                  })
                ],
              ),
            ),
          )),
        ],
      ),
    );
  }
}

class NoticeItem extends StatelessWidget {
  final String text;

  const NoticeItem({
    super.key,
    required this.text,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              margin: const EdgeInsets.only(right: 16, top: 10),
              width: 3,
              height: 3,
              decoration: const BoxDecoration(
                  color: Colors.black, shape: BoxShape.circle),
            ),
            Expanded(
                child: Text(
              text,
              strutStyle: const StrutStyle(height: 1.8),
              style: const TextStyle(fontSize: 14, color: Colors.black),
            ))
          ],
        )
      ],
    );
  }
}
